<template>
  <div class="commcoor">
     <div class="navbox">
        <el-row>
            <el-col :span="24">
                <div class="homeNav">
                    <el-breadcrumb separator="/">
                        <el-breadcrumb-item :to="{ path: '/Outcoor' }">合作</el-breadcrumb-item>
                        <el-breadcrumb-item :to="{path:'/Commcoor'}">调研合作</el-breadcrumb-item>
                    </el-breadcrumb>
                </div>
            </el-col>
        </el-row>
     </div>
     <div class="winContent">
        <el-row :gutter="20">
            <el-col :span="16">
              <div class="commContent">
                 <el-tabs :tab-position="tabPosition" style="height: 200px;">
                   <el-tab-pane label="学术合作">
                     <el-timeline>
                         <el-timeline-item timestamp="2019.11.28-2019.12.07" placement="top">
                           <el-card>
                             <h4>签署中德合作协议</h4>
                             <p>在中国·三亚由中华医学会急诊学会,德国急诊学会举行的“中德急救医学峰会”中</p>
                           </el-card>
                         </el-timeline-item>
                      </el-timeline>
                     </el-tab-pane>
                   <el-tab-pane label="院际合作">
                     <el-card class="box-card">
                        <div>德国福尔达大学附属医院</div>
                        <el-divider></el-divider>
                        <div>广东省中医院</div>
                      </el-card>
                   </el-tab-pane>
                   <el-tab-pane label="调研医院">
                     <el-tabs v-model="activeName" @tab-click="handleClick">
                       <el-tab-pane label="调研瑞丽市人民医院、景成医院" name="first">
                         <el-card class="box-card">
                           <div>
                              <img src="../assets/dy1.png" min-width="150" alt="" />
                           </div>
                         </el-card>
                       </el-tab-pane>
                       <el-tab-pane label="调研保山市人民医院" name="second">
                         <el-card class="box-card">
                           <div>
                              <img src="../assets/dy2.png" min-width="150" alt="" />
                           </div>
                         </el-card>
                       </el-tab-pane>
                       <el-tab-pane label="调研大理大学第一附属医院" name="third">
                         <el-card class="box-card">
                          <div>
                           <img src="../assets/dy3.png" min-width="150" alt="" />
                          </div>
                         </el-card>
                       </el-tab-pane>
                     </el-tabs>
                   </el-tab-pane>
                 </el-tabs>
              </div>
            </el-col>
           <el-col :span="8">
              <div class="home_right">
                <div class="homeList">
                  <ul>
                      <li>
                          <router-link to="/culture"><span class="sLeft">德国合作</span><span class="sright">>></span></router-link>
                      </li>
                        <el-divider></el-divider>
                      <li>
                          <router-link to="/culture"><span class="sLeft">国内合作</span><span class="sright">>></span></router-link>
                      </li>
                        <el-divider></el-divider>
                      <li>
                          <router-link to="/culture"><span class="sLeft">合作伙伴</span><span class="sright">>></span></router-link>
                      </li>
                        <el-divider></el-divider>
                        <li>
                          <router-link to="/culture"><span class="sLeft">调研交流</span><span class="sright">>></span></router-link>
                      </li>
                 </ul>
                </div>
                <div class="homeConnect">
                     <p class="connect_h">联系我们</p>
                     <el-divider></el-divider>
                     <p>电话：86-10-68005755,86-10-68006083</p>
                     <p>E-mail:xmbj2005@163.com</p>
                     <p>邮箱:492800904@qq.com</p>
                     <p>地址：北京市西城区西直门外大街18号金贸大厦A座935</p>
                     <P>
                         <img src="../assets/code.jpg"
                              alt="" />
                     </P>
                </div>
              </div>
            </el-col>
            <!-- 联系方式结束 -->
          </el-row>
         </div>
  </div>
</template>
<script>
export default {
    data() {
      return {
        tabPosition: 'left'
      };
    }
  };
</script>
<style lang="less">
* {
  padding: 0;
  margin: 0;
}
.commcoor {
  width: 100%;
 .navbox {
        .el-row {
            .el-col {
                .homeNav {
                    width: 100%;
                    margin: 3.125rem /* 50/16 */;
                }
            }
        }
    }
    .winContent {
      margin-left:3.125rem /* 50/16 */;
        .el-row {
          .el-col{
            .commContent{
              .el-tabs{
                height:18.75rem /* 300/16 */!important;
                
              }
            }
          }
          .el-col {
                .home_right {
                    width: 100%;
                    margin-left: 3.125rem /* 50/16 */;
                    .homeList {
                        text-align: center;
                        margin-bottom: 1.875rem /* 30/16 */;
                        ul {
                            background-color: #0a77a0;
                            width: 50%;
                            text-align: left;
                            li {
                                list-style: none;
                                height: 1.875rem /* 30/16 */;
                                line-height: 1.875rem /* 30/16 */;
                                padding: 0.9375rem /* 15/16 */;
                                a {
                                    text-decoration: none;
                                    color: #fff;
                                    .sLeft {
                                        float: left;
                                    }
                                    .sright {
                                        float: right;
                                    }
                                }
                            }
                        }
                    }
                    .homeConnect {
                        width: 80%;
                        .connect_h {
                            color: #0a77a0;
                        }
                        p {
                            line-height: 1.875rem /* 30/16 */;
                        }
                    }
                }
            }
        }
    }
}
</style>
